<template>
  <div>
    <h4>通过watch模拟双向绑定</h4>
    <input type="text" @keyup="getVal" ref="ipt" />
    <p @click="change($event)">{{ txt }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      txt: "",
    };
  },
  methods: {
    getVal() {
      this.txt = this.$refs.ipt.value;
    },
    change(e) {
      this.txt = Number(e.target.innerText) + 10;
    },
  },
  watch: {
    txt() {
      this.$refs.ipt.value = this.txt;
    },
  },
};
</script>

<style lang="scss" scoped></style>
